<template>
 <!--下面左侧菜单-->
 <div style="display: flex; min-height: 90vh;">
        <div style="width: 15%;">
            <el-menu router :default-active="activeIndex.toString()"  :default-openeds="['4']" style="border: 0cap;">
                <el-menu-item index="/home/enterprise/enterprisehome">
                    <el-icon>
                        <House />
                    </el-icon>首页
                </el-menu-item>
                <el-menu-item index="/home/enterprise/payendowment">
                    <el-icon><Money /></el-icon>
                    保险缴纳</el-menu-item>
                <el-menu-item index="/home/enterprise/enterpriseendowment">
                    <el-icon><Tickets /></el-icon>缴纳记录
                </el-menu-item>
                <el-sub-menu index="4">
                    <template #title>
                        <div style="padding-right: 10%;">
                            <el-icon>
                                <User />
                            </el-icon>
                            <span>员工管理</span>
                        </div>
                    </template>
                    <el-menu-item index="/home/enterprise/enterpriseemplyeeinfo">在职员工</el-menu-item>
                    <el-menu-item index="/home/enterprise/retireemplyee">退休员工 </el-menu-item>
                </el-sub-menu>
                
            </el-menu>
        </div>
        <!--下面右侧主体-->
        <div style="flex: 1;width: 0; background-color: #f5f7ff; padding: 10px;">
            <RouterView />
        </div>
    </div>
</template>

<script setup>
import { ref, watch } from 'vue';
import { useRoute } from 'vue-router';

const route = useRoute();
const activeIndex = ref(route.path); // 初始化为当前路由路径
watch(
  () => route.path,
  (newPath) => {
      activeIndex.value = newPath;
  }
);
</script>